<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>发布/订阅模式</title>
</head>

<body>
    <script>
        // // 最简单最常见的 发布/订阅模式 
        // document.body.addEventListener('click', () => {
        //     alert("点击了body")
        // })

        // class Subsciber {
        //     even = {}
        //     subscribe(type, fn) {
        //         if (!this.even[type]) {
        //             this.even[type] = [fn]
        //         } else {
        //             this.even[type].push[fn]
        //         }
        //     }
        //     publish(type, args) {
        //         console.log(this.even[type]);
        //         if (!this.even[type]) {
        //             return this.even[type]
        //         }
        //         for (let i = 0; i < this.even[type].length; i++) {
        //             this.even[type][i].call(this, args)
        //         }
        //     }
        // }
        // var sub = new Subsciber()
        // // 订阅 事件
        // sub.subscribe('merry', function (e) {
        //     console.log("等你结婚我给你 份子钱" + 100 + "元");
        // })
        // sub.subscribe('merry2', function (e) {
        //     console.log("2等你结婚我给你 份子钱" + 100 + "元");
        // })
        // // 发布 事件
        // sub.publish('merry', { message: "我要结婚了" })


        /**
         *  观察者模式
        */

        // 目标者
        class Subject {
            constructor() {
                this.observers = []
            }
            add(observer) {
                this.observers.push(observer)
            }
            // 通知
            notify() {
                for (let o of this.observers) {
                    o.updata
                }
            }
        }
        // 观察者
        class Observer {
            updata() {
                console.log("目标值通知:我更新了!");
            }
        }
        let sub = new Subject()//
        let ob = new Observer()//观察者
        sub.add(ob)
        sub.notify()
    </script>
</body>

</html>